<template>
	<el-dialog width="500px" title="添加子账号" :visible.sync="dialogVisible" :close-on-click-modal="false">
		<el-form ref="ruleForm" :model="form" label-width="100px">
			<el-form-item label="用户名">
				<el-input v-model="form.username" placeholder="备注" />
			</el-form-item>
			<el-form-item label="手机号" prop="mobile">
				<el-input v-model="form.mobile" placeholder="备注" />
			</el-form-item>
		</el-form>
		<div slot="footer" class="dialog-footer">
			<el-button size="small" @click="dialogVisible = false">取 消</el-button>
			<el-button size="small" type="primary" @click="submit">确 定</el-button>
		</div>
	</el-dialog>
</template>

<script>
	import {
		saleSonAdd
	} from '@/api/extension'
	export default {
		props: {
			saleUserId: {
				type: Number,
				default: 0
			}
		},
		data() {
			return {
				form: {
					username: '',
					mobile: ''
				},
				dialogVisible: false
			}
		},
		watch: {
			dialogVisible(val) {
				console.log(this.saleUserId);
				if (val) {
					this.form.username = ''
					this.form.mobile = ''
				} else {
					this.$refs['ruleForm'].resetFields()
				}
			}
		},
		methods: {
			submit() {
				this.$refs['ruleForm'].validate((valid) => {
					if (valid) {
						const params={
							username:this.form.username,
							mobile:this.form.mobile
						}
						saleSonAdd(params).then(res=>{
							console.log(res);
							this.$message({
								message: '添加成功',
								type: 'success'
							})
							this.dialogVisible=false
						})
						
					} else {
						this.$message({
							message: '请检查表单错误',
							type: 'error'
						})
						return false
					}
				})
			}
		}
	}
</script>

<style lang="less" scoped>
</style>
